main {
	width: 100%;
	height: 100%;
	min-width: 1200px;
}
main > .picbox {
	width: 800px;
	height: 550px;
	background-color: #1ca8ef;
}
main > .picbox img {
	width: 600px;
	margin: auto;
}

/* 模态框容器 */
main .outer {
	flex: 1;
	height: 550px;
}
/* 模态框 */
#modalBox {
	width: 400px;
	/* height: 550px; */
	padding: 34px 20px;
	align-items: center;
	margin: auto;
}
/* 模态框-选项按钮 */
#modalBox ul {
	color: #555555;
	margin: 36px 0;
}
#modalBox ul li {
	width: 125px;
	height: 30px;
}
/* 模态框-选项按钮激活样式 */
#modalBox ul li.active::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%);
	width: 35%;
	height: 3px;
	background-color: #00bdff;
}
#modalBox ul i {
	width: 2px;
	height: 12px;
	background-color: #eeeeee;
}
/* 模态框卡片1 */
#modalBox ol .card1 p {
	width: 355px;
	height: 40px;
	border-bottom: 1px solid #e7e7e7;
	align-items: center;
	margin-bottom: 18px;
	padding-left: 5px;
	color: #909090;
}
#modalBox ol .card1 input {
	border: 0;
	outline: none;
	text-indent: 5px;
}
#modalBox ol .card1 .mask {
	font-size: 12px;
	display: block;
	width: 300px;
	color: #f15b5b;
	position: absolute;
	left: 102%;
	top: 15px;
	display: none;
}
#modalBox ol .card1 .mask strong {
	color: white;
	background-color: #f15b5b;
	padding: 1px 7px;
	border-radius: 50%;
}
#modalBox ol .card1 #icon1 {
	width: 23px;
	height: 23px;
	background: url(../imgs/loginIcon.png) no-repeat -57px -3px;
}
#modalBox ol .card1 #icon2 {
	width: 23px;
	height: 23px;
	background: url(../imgs/loginIcon.png) no-repeat -27px -3px;
}
#modalBox ol .card1 a:nth-child(3) {
	display: inline-block;
	width: 100%;
}
/* 模态框卡片1-登陆按钮 */
#modalBox ol .card1 button {
	width: 100%;
	height: 46px;
	border: 0;
	background-color: #03c5ff;
}
#modalBox ol .card1 p:last-child {
	border: 0;
	height: 50px;
	padding-left: 128px;
}
/* 模态框卡片2 */
#modalBox ol .card2 .card2-erweima {
	width: 290px;
	height: 240px;
	border: 1px solid #eeeeee;
	background-color: #fcfcfc;
	margin: 0 auto;
	justify-content: center;
	align-items: center;
}
#modalBox ol .card2-erweima img {
	width: 105px;
}
/* 精灵图标#3 */
#modalBox ol li p #icon3 {
	display: inline-block;
	margin-left: 8px;
	width: 15px;
	height: 15px;
	background: url(../imgs/loginIcon.png) no-repeat -56px -38px;
}
/* 模态框卡片交互 */
#modalBox ol > li {
	display: none;
}
#modalBox ol > li.on {
	display: block;
}
